<template>
  <div>
    <button @click="isShow = true">点击</button>
    <!-- <Modal :isShow="isShow" :title="title" @autoClk="autoClk"> -->
    <!-- <Modal :isShow.sync="isShow" :title="title"> -->
    <Modal :isShow="isShow" :title="title">
      <template #content>
        <!-- <div>姓名：<input type="text" /></div>
        <div>年龄：<input type="text" /></div> -->
      </template>
      <template v-slot:footer>
        <button @click="isShow = false">确定</button>
        <button @click="isShow = false">取消</button>
      </template>
    </Modal>
  </div>
</template>

<script>
import Modal from "@/components/Modal.vue";
export default {
  data() {
    return {
      isShow: true,
      title: "模式组件的题目",
    };
  },
  methods: {
    autoClk(val) {
      console.log(val);
      this.isShow = val;
    },
  },
  components: {
    Modal,
  },
};
</script>

<style  scoped>
</style>